import React, { useEffect, useState } from 'react';
import dayjs from 'dayjs';
import {
  Button,
  Cascader,
  DatePicker,
  Form,
  Input,
  InputNumber,
  Radio,
  Select,
  Switch,
  TreeSelect,
} from 'antd';
import type { FormProps } from 'antd';
import {useDispatch} from 'react-redux'
import * as Async from '@/app/store/splice'
import { time } from 'console';
type SizeType = Parameters<typeof Form>[0]['size'];
type FieldType = {
    username?: string;
    password?: string;
    remember?: string;
  };
const MyForm: React.FC = (props:any) => {
    let dispatch = useDispatch()
    const [form] = Form.useForm();
    useEffect(()=>{
        if(props.title=='编辑'){
            form.setFieldsValue(props.itemobj)
        }
    })
  const [componentSize, setComponentSize] = useState<SizeType | 'default'>('default');

  const onFormLayoutChange = ({ size }: { size: SizeType }) => {
    setComponentSize(size);
  };
  const onFinish: FormProps<FieldType>['onFinish'] = (values) => {
    console.log('Success:', values);
    if(props.title=='新增'){
        let obj={
            ...values,
            id:new Date().getTime(),
            endTime:new Date().getTime(),
            time:new Date().getTime()
        }
        dispatch(Async.async_addcustomerlist(obj))
    }else{
        let obj={
            ...props.itemobj,
            ...values,
           
        }
        dispatch(Async.async_editcustomerlist(obj))
    }
    props.onCancel()
  };

  return (
    <Form
    form={form}
      onFinish={onFinish}
      labelCol={{ span: 4 }}
      wrapperCol={{ span: 14 }}
      layout="horizontal"
      initialValues={{ size: componentSize }}
      onValuesChange={onFormLayoutChange}
      size={componentSize as SizeType}
      style={{ maxWidth: 600 }}
    >
      <Form.Item label="客户名称" name="title">
        <Input />
      </Form.Item>
      <Form.Item label="客户状态" name="state">
        <Select options={[
          {
            value:true,label:"正在跟进"
          },
          {
            value:false,label:"已完成跟进"
          },
        ]} />
      </Form.Item>
      <Form.Item label="客户星级" name="CustomerStarRating">
        <Select options={[
          {
            value:1,label:"一星客户"
          },
          {
            value:2,label:"二星客户"
          },
          {
            value:3,label:"三星客户"
          },
          {
            value:4,label:"四星客户"
          },
          {
            value:5,label:"五星客户"
          },
        ]} />
      </Form.Item>
      <Form.Item label="首席联系人" name="contacts">
        <Input />
      </Form.Item>
      <Form.Item label="手机号码" name="phone">
        <Input />
      </Form.Item>
      <Form.Item label="最后跟进" name="endTime">
        <Input />
      </Form.Item>
      <Form.Item>
        <Button htmlType='submit'>确定</Button>
      </Form.Item>
    </Form>
  );
};

export default MyForm;